<template>
	<view class="mine">
		<view class="userback">
			<image src="../../static/avg.jpg">
			<view class="userName">Taurus</view>
		</view>
		
		<view class="uni-list" v-for="(item,index) in list" :key="index">
			<navigator :url="item.path">
				<view class="uni-list-cell" hover-class="uni-list-cell-hover">
					<image :src="item.img" mode=""></image>
					<view class="uni-list-cell-navigate uni-navigate-right">
						<span style="margin-left: -11px;font-size: 18px;">{{item.title}}</span>
					</view>
				</view>
			</navigator>
		</view>

		<view class="btn">
			<button type="primary" @click="logout">退出登录</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[
					{img:'../../static/朋友圈.png',path:'../friend/friend',title:'朋友圈'},
					{img:'../../static/视频.png',path:'../audio/audio',title:'视频'},
					{img:'../../static/扫扫.png',path:'../sao/sao',title:'扫扫'},
					{img:'../../static/摇摇.png',path:'../yao/yao',title:'摇摇'},
					{img:'../../static/看看.png',path:'../look/look',title:'看看'},
					{img:'../../static/设置.png',path:'../setting/setting',title:'设置'}
				]
			}
		},
		methods: {
			logout(){
				uni.showModal({ title: '友情提示',
				    content: '确认退出登录吗？',
				    success: function (res) {
						if (res.confirm) {
							uni.navigateTo({//跳转页面
								url:"../login/login" ,
							})         
						} else if (res.cancel) {
							console.log('用户点击取消'); 
						}    
					} ,
				});
			}
		}
	}
</script>

<style scoped>
	.btn {
		padding: 30px 15px;
	}
	.userback {
		height: 180px;
		background-color: #007AFF;
		background-repeat: no-repeat;
		background-size: 100%;
		text-align: center
	}
	.userback image {
		margin: auto;
		border-radius: 50px;
		margin-top: 20px;
		width: 80px;
		height: 80px;
	}
	.userName{
		color: #111111;
		font-size: 1.6rem;
	}
	.uni-list-cell image{
		width: 25px;
		height: 25px;
		padding: 10rpx 10rpx;
	}
</style>
